<!--
TODO:
* Open user Account Info panel on start
* auto-hide after delay mode
* auto-show on updates mode
* always on top mode
* Soft restart
* Feature: option to NOT save password
* auto-completing usernames when typing "@" or "d "
* Feature: block users
* snap-to-edge of screen	
-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:spry="http://ns.adobe.com/spry">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<title>Spaz</title>

	<link rel="stylesheet" href="assets/init.css" type="text/css" media="screen" charset="utf-8" />

	<script src="assets/AIRAliases.js" type="text/javascript" charset="utf-8"></script>
	<!-- <script src="assets/AIRIntrospector.js" type="text/javascript" charset="utf-8"></script> -->



	<!-- Spry Widgets -->
	<script language="JavaScript" type="text/javascript" src="SpryAssets/widgets/tabbedpanels/SpryTabbedPanels.js"></script>
	<script language="JavaScript" type="text/javascript" src="SpryAssets/widgets/textareavalidation/SpryValidationTextarea.js" ></script>
	<script language="JavaScript" type="text/javascript" src="SpryAssets/widgets/textfieldvalidation/SpryValidationTextField.js"></script>
	<script language="JavaScript" type="text/javascript" src="SpryAssets/widgets/collapsiblepanel/SpryCollapsiblePanel.js"></script>
	<script language="JavaScript" type="text/javascript" src="SpryAssets/widgets/htmlpanel/SpryHTMLPanel.js"></script>
	<link rel="stylesheet" type="text/css" href="SpryAssets/widgets/tabbedpanels/SpryTabbedPanels.css" />
	<link rel="stylesheet" type="text/css" href="SpryAssets/widgets/textareavalidation/SpryValidationTextarea.css" />
	<link rel="stylesheet" type="text/css" href="SpryAssets/widgets/textareavalidation/SpryValidationTextField.css" />
	<link rel="stylesheet" type="text/css" href="SpryAssets/widgets/htmlpanel/SpryHTMLPanels.css" />


	<!-- base64 encoding lib -->
	<script src="assets/webtoolkit.base64.js" type="text/javascript"></script>

	<!-- Keyboard shortcuts handling http://www.openjs.com/scripts/events/keyboard_shortcuts/ -->
	<script src="assets/shortcut.js" type="text/javascript" charset="utf-8"></script>

	<!-- Mootools -->
	<!-- <script src="assets/mootools-release-1.11.js" type="text/javascript" charset="utf-8"></script>
 -->

	<!-- jQuery libs -->
	<script src="assets/jquery-1.2.1.js" type="text/javascript" charset="utf-8"></script>
	<script src="assets/jquery.dimensions.js" type="text/javascript"></script>
	<script src="assets/jquery.moreSelectors.js" type="text/javascript"></script>
	<script src="assets/jquery.scrollTo.js" type="text/javascript"></script>
	<script src="assets/jquery.array.js" type="text/javascript" charset="utf-8"></script>
	<script src="assets/jquery.intercept.1.0.2.js" type="text/javascript" charset="utf-8"></script>
	<script src="assets/jquery.ajaxQueue.js" type="text/javascript" charset="utf-8"></script>
	
	<!-- jQuery.UI libs -->
	<script src="assets/jquery-ui.min.js" type="text/javascript" charset="utf-8"></script>


	<!-- Spaz libs -->
	<script src="assets/spaz.js"        type="text/javascript"></script>
	<script src="assets/spaz.data.js"   type="text/javascript"></script>
	<script src="assets/spaz.debug.js"  type="text/javascript"></script>
	<script src="assets/spaz.cache.js"  type="text/javascript"></script>
	<script src="assets/spaz.ui.js"     type="text/javascript"></script>
	<script src="assets/spaz.update.js" type="text/javascript"></script>
	<script src="assets/spaz.bridge.js" type="text/javascript"></script>
	<script src="assets/spaz.notify.js" type="text/javascript" charset="utf-8"></script>
	<script src="assets/spaz.section.js" type="text/javascript" charset="utf-8"></script>
	<script src="assets/spaz.handlers.js" type="text/javascript" charset="utf-8"></script>
	<script src="assets/spaz.keyboard.js" type="text/javascript" charset="utf-8"></script>
	<script src="assets/spaz.editor.js" type="text/javascript" charset="utf-8"></script>
	
	<!-- <script src="lib/library.swf" type="application/x-shockwave-flash"></script> -->

	<!-- User CSS override file -->
	<style type="text/css" media="screen" id="UserCSSOverride"></style>
	
	
	<!-- theme scripts -->
	<script type="text/javascript" charset="utf-8" id="themejs"></script>
	<script type="text/javascript" charset="utf-8" id="themeinfo"></script>

	<!-- Firebug lite -->
	<script language="javascript" type="text/javascript" src="assets/firebug/firebug.js"></script>

	<!-- Showdown, the Markdown parser -->
	<script src="assets/showdown.js" type="text/javascript" charset="utf-8"></script>
	
</head>

<body id="home" onclick="$('#linkContextMenu').hide()">

	<div id="container">

		<h1 id="header" onmousedown="Spaz.UI.onNativeMove();">
			<div id="window-buttons">
				<span id="about" class="window-button" onclick="Spaz.UI.showAbout()" title="About">i</span>
				<span id="help" class="window-button" onclick="Spaz.UI.showHelp()" title="Help">?</span>
				<span id="minimize" class="window-button" onclick="Spaz.UI.windowMinimize()" title="Minimize">&ndash;</span>
				<span id="close" class="window-button" onclick="Spaz.Bridge.windowClosingHandler()" title="Close">&times;</span>
			</div>
			<span id="header-label">Spaz</span>
		</h1>


		<div id="tabs" class="TabbedPanels">
			<ul class="TabbedPanelsTabGroup" id="timeline-tabs" tabindex="0">
				<!-- YOUR TIMELINE -->
				<li class="TabbedPanelsTab" tabindex="0" title="Your timeline" 
					onmouseover="Spaz.UI.showTooltip(this, this.title)" 
					onmouseout="Spaz.UI.hideTooltips()"
					id="tab-friends" onclick="Spaz.UI.setSelectedTab(this)">
					<img class="tab-icon" src="{theme-dir}/images/tab-icon-timeline.png" />
				</li>

				<!-- SENT STATUSES -->
				<li class="TabbedPanelsTab" tabindex="0" title="Tweets you've sent" 
					onmouseover="Spaz.UI.showTooltip(this, this.title)" 
					onmouseout="Spaz.UI.hideTooltips()"
					id="tab-user" onclick="Spaz.UI.setSelectedTab(this)">
					<img class="tab-icon" src="{theme-dir}/images/tab-icon-user.png" />
				</li>
				
				<!-- PUBLIC -->
				<li class="TabbedPanelsTab" tabindex="0" title="Public timeline" 
					onmouseover="Spaz.UI.showTooltip(this, this.title)" 
					onmouseout="Spaz.UI.hideTooltips()"
					id="tab-public" onclick="Spaz.UI.setSelectedTab(this)">
					<img class="tab-icon" src="{theme-dir}/images/tab-icon-public.png" />
				</li>
		
				<!-- PREFS -->
				<li class="TabbedPanelsTab" tabindex="0" id="tab-prefs" title="Preferences"
					onmouseover="Spaz.UI.showTooltip(this, this.title)" 
					onmouseout="Spaz.UI.hideTooltips()"
					onclick="Spaz.UI.setSelectedTab(this)">
					<img class="tab-icon" src="{theme-dir}/images/tab-icon-prefs.png" />
				</li>
			</ul>
	
	
	
	
			<!-- BEGIN CONTENT TABS -->
			<div class="TabbedPanelsContentGroup" id="timeline-tabs-content">

				<!-- FRIENDS AND YOU TIMELINE -->
				<div class="TabbedPanelsContent" id="panel-friends">
					<div spry:region="Spaz.Data.ds_friends" id="timeline-friends" class="timeline">
						<!-- onmouseover="Spaz.UI.focusHandler()"
						onmouseout="Spaz.UI.blurHandler()"
						onclick="Spaz.UI.clickHandler()" -->

				
					</div>
					<!-- <div class="timeline-pager">
						<div class="timeline-pager-left"><a onclick="Spaz.UI.pageLeft(Spaz.UI.selectedTab);" title="Load newer entries">&laquo;</a></div>				
						<div class="timeline-pager-right"><a onclick="Spaz.UI.pageRight(Spaz.UI.selectedTab);" title="Load older entries">&raquo;</a></div>
						<div class="timeline-pager-info">page <span class="timeline-pager-number">1</span></div>
					</div> -->
				</div>


				<!-- REPLIES TIMELINE -->
				<!-- <div class="TabbedPanelsContent" id="panel-replies">
			
					<div spry:region="Spaz.Data.ds_replies" id="timeline-replies" class="timeline">
				
					</div>
					<div class="timeline-pager">
						<div class="timeline-pager-left"><a onclick="Spaz.UI.pageLeft(Spaz.UI.selectedTab);" title="Load newer entries">&laquo;</a></div>				
						<div class="timeline-pager-right"><a onclick="Spaz.UI.pageRight(Spaz.UI.selectedTab);" title="Load older entries">&raquo;</a></div>
						<div class="timeline-pager-info">page <span class="timeline-pager-number">1</span></div>
					</div>
				</div> -->

		
				<!-- DIRECT MESSAGES -->
				<!-- <div class="TabbedPanelsContent" id="panel-dms">
			
					<div spry:region="Spaz.Data.ds_dms" id="timeline-dms" class="timeline">
				
					</div>
					<div class="timeline-pager">
						<div class="timeline-pager-left"><a onclick="Spaz.UI.pageLeft(Spaz.UI.selectedTab);" title="Load newer entries">&laquo;</a></div>				
						<div class="timeline-pager-right"><a onclick="Spaz.UI.pageRight(Spaz.UI.selectedTab);" title="Load older entries">&raquo;</a></div>
						<div class="timeline-pager-info">page <span class="timeline-pager-number">1</span></div>
					</div>
				</div> -->

		
				<!-- YOUR SENT MESSAGES -->
				<div class="TabbedPanelsContent" id="panel-user">
					<div spry:region="Spaz.Data.ds_user" id="timeline-user" class="timeline">				

					</div>
					<!-- <div class="timeline-pager">
						<div class="timeline-pager-left"><a onclick="Spaz.UI.pageLeft(Spaz.UI.selectedTab);" title="Load newer entries">&laquo;</a></div>				
						<div class="timeline-pager-right"><a onclick="Spaz.UI.pageRight(Spaz.UI.selectedTab);" title="Load older entries">&raquo;</a></div>
						<div class="timeline-pager-info">page <span class="timeline-pager-number">1</span></div>
					</div> -->
				</div>

		
				<!-- PUBLIC TIMELINE -->
				<div class="TabbedPanelsContent" id="panel-public">
					<div spry:region="Spaz.Data.ds_public" id="timeline-public" class="timeline">

					</div>
				</div>
		
		
		
				<!-- LIST OF PEOPLE YOU ARE FOLLOWING -->
				<!-- <div class="TabbedPanelsContent" id="panel-friendslist">
					<div class="timeline directory">
						<div id="friendslist-detail" spry:detailregion="Spaz.Data.ds_friendslist" class="SpryHiddenRegion">
							<div class="user-image"><a title="Click to open profile in browser" onclick='openInBrowser("http://twitter.com/{screen_name}")'><img height="48" width="48" src="{profile_image_url}" alt="{screen_name}" /></a></div>
							<div class="user-list-details">
								<h2>{name} ({screen_name})</h2>
								<div class="user-location"><a onclick="Spaz.UI.showLocationOnMap('{location}')" title="Open this location on Yahoo! Maps in broswer">{location}</a></div>
						
								<div class="user-description">{description}</div>
								<div class="user-menu"><a onclick="Spaz.Data.followUser('{screen_name}')" class="follow">Follow</a> <a onclick="Spaz.Data.stopFollowingUser('{screen_name}')" class="stop-follow">Stop Following</a> <a onclick='Spaz.UI.prepDirectMessage("{screen_name}")' class="dm">DM</a> <a onclick="Spaz.UI.prepReply('{screen_name}')" class="reply">Reply</a></div>
								<div class="status-text" id="#status-text-{id}"><strong>Last update:</strong> {status/text}</div>
							</div>
						</div>
						<div id="friendslist" class="user-list" spry:region="Spaz.Data.ds_friendslist">
							<div class="user-list-wrapper">
								<div spry:repeat="Spaz.Data.ds_friendslist" spry:setrow="Spaz.Data.ds_friendslist"  class="user" id="friends-user-{id}">
									<div class="user-image"><a title="{screen_name}"><img height="48" width="48" src="{profile_image_url}" alt="{screen_name}"  /></a></div>
									<div class="user-screen-name" id="friends-user-screen-name-{id}" title="{name}">{screen_name}</div>
								</div>
							</div>
						</div>
					</div>
					<div class="timeline-pager">
						<div class="timeline-pager-left"><a onclick="Spaz.UI.pageLeft(Spaz.UI.selectedTab);" title="Load newer entries">&laquo;</a></div>				
						<div class="timeline-pager-right"><a onclick="Spaz.UI.pageRight(Spaz.UI.selectedTab);" title="Load older entries">&raquo;</a></div>
						<div class="timeline-pager-info">page <span class="timeline-pager-number">1</span></div>
					</div>
				</div> -->
		
		
		
				<!-- LIST OF FOLLOWERS -->
				<!-- <div class="TabbedPanelsContent" id="panel-followerslist">
					<div class="timeline directory">
						<div id="followerslist-detail" spry:detailregion="Spaz.Data.ds_followerslist" class="SpryHiddenRegion">
							<div class="user-image"><a title="Click to open profile in browser" onclick='openInBrowser("http://twitter.com/{screen_name}")'><img height="48" width="48" src="{profile_image_url}" alt="{screen_name}" /></a></div>
							<div class="user-list-details">
								<h2>{name} ({screen_name})</h2>
								<div class="user-location"><a onclick="Spaz.UI.showLocationOnMap('{location}')" title="Open this location on Yahoo! Maps in broswer">{location}</a></div>
								<div class="user-description">{description}</div>
						
								<div class="user-menu"><a onclick="Spaz.Data.followUser('{screen_name}')" class="follow">Follow</a> <a onclick="Spaz.Data.stopFollowingUser('{screen_name}')" class="stop-follow">Stop Following</a> <a onclick='Spaz.UI.prepDirectMessage("{screen_name}")' class="dm">DM</a> <a onclick="Spaz.UI.prepReply('{screen_name}')" class="reply">Reply</a></div>
								<div class="status-text" id="#status-text-{id}"><strong>Last update:</strong> {status/text}</div>
							</div>
						</div>
						<div id="followerslist" class="user-list" spry:region="Spaz.Data.ds_followerslist">
							<div class="user-list-wrapper">
								<div spry:repeat="Spaz.Data.ds_followerslist" spry:setrow="Spaz.Data.ds_followerslist"  class="user" id="followers-user-{id}">
									<div class="user-image"><a title="{name}"><img height="48" width="48" src="{profile_image_url}" alt="{screen_name}" /></a></div>
									<div class="user-screen-name" id="followers-user-screen-name-{id}" title="{name}">{screen_name}</div>
								</div>
							</div>
						</div>
					</div>
					<div class="timeline-pager">
						<div class="timeline-pager-left"><a onclick="Spaz.UI.pageLeft(Spaz.UI.selectedTab);" title="Load newer entries">&laquo;</a></div>				
						<div class="timeline-pager-right"><a onclick="Spaz.UI.pageRight(Spaz.UI.selectedTab);" title="Load older entries">&raquo;</a></div>
						<div class="timeline-pager-info">page <span class="timeline-pager-number">1</span></div>
					</div>
				</div> -->
		
		
				<!-- PREFS -->
				<div class="TabbedPanelsContent" id="panel-prefs">
					<div class="timeline" id="timeline-prefs">
						<form id="prefs-form" onsubmit="Spaz.Bridge.setPrefs(); return false;">
						<div id="prefsCPG" class="CollapsiblePanelGroup">
					
							<div id="prefs-user-fieldset" class="CollapsiblePanel">
								<h2 class="CollapsiblePanelTab" tabindex="0">Account Information</h2>
								<div class="CollapsiblePanelContent">
									<div class="formrow">
										<label for="username">Username</label>
										<input type="text" name="username" id="prefs-username" value="" />
									</div>
									<div class="formrow">
										<label for="password">Password</label>
										<input type="password" name="password" id="prefs-password" value="" />
									</div>
								</div>
							</div>
					
							<div id="prefs-style-fieldset" class="CollapsiblePanel">
								<h2 class="CollapsiblePanelTab" tabindex="0">Interface</h2>
								<div class="CollapsiblePanelContent">
									<div class="formrow">
										<label for="user-stylesheet">User CSS</label>
										<input disabled="disabled" type="text" name="user-stylesheet" value="" id="prefs-user-stylesheet" />
										<input type="button" name="user-stylesheet-button" value="…" id="prefs-user-stylesheet-button" onclick="Spaz.UI.browseForUserCss()" />
										<input type="button" name="user-stylesheet-clear" value="&times;" id="prefs-user-stylesheet-clear" onclick="Spaz.UI.clearUserStyleSheet()" />
									</div>
									<div class="formrow">
										<label for="base-theme">Theme</label>
										<select id="prefs-base-theme" name="base-theme" onChange="Spaz.UI.setCurrentTheme()">
											<!-- stuff goes here -->
										</select> <span class="restart-required">*</span>
									</div>
									<div class="formrow">
										<label for="base-theme">Opacity</label>
										<input type="text" onchange="Spaz.Bridge.checkWindowOpacity(this.value)"
											name="opacity-percentage" id="prefs-opacity-percentage"
											value="100" maxlength="3" size="3" />%
									</div>
									<div class="formrow">
										<input type="checkbox" name="markdown-enabled" value="1" id="prefs-markdown-enabled" onclick="Spaz.UI.setMarkdownState(this.checked)" />
										<label for="markdown-enabled" class="checkbox">Parse Markdown in messages</label> <span class="restart-required">*</span>
									</div>
									<div class="formrow">
										<input type="checkbox" name="minimize-systray" value="1"
											id="prefs-minimize-systray"
											onclick="Spaz.UI.setMinimizeToSystray(this.checked)" />
										<label for="minimize-systray" class="checkbox">Minimize to Systray</label> <span class="restart-required">*</span>
									</div>
									<div class="formrow">
										<input type="checkbox" name="minimize-background" value="1"
											id="prefs-minimize-background"
											onclick="Spaz.UI.setMinimizeOnBackground(this.checked)" />
										<label for="minimize-background" class="checkbox">Minimize when in background</label> <span class="restart-required">*</span>
									</div>
									<div class="formrow">
										<input type="checkbox" name="maximize-foreground" value="1"
											id="prefs-maximize-foreground"
											onclick="Spaz.UI.setRestoreOnActivate(this.checked)" />
										<label for="maximize-foreground" class="checkbox">Restore when in foreground</label> <span class="restart-required">*</span>
									</div>
									<div class="formrow">
										<input type="checkbox" name="notification-popups" value="1"
											id="prefs-show-notification-popups"
											onclick="Spaz.UI.setShowNotificationPopups(this.checked)" />
										<label for="notification-popups" class="checkbox">Show notification popups (alpha)</label> <!-- <span class="restart-required">*</span> -->
									</div>
								</div>
							</div>
					
							<div id="prefs-sound-fieldset" class="CollapsiblePanel">
								<h2 class="CollapsiblePanelTab" tabindex="0">Sound</h2>
								<div class="CollapsiblePanelContent">
									<div class="formrow">
										<label for="sound-enabled">Play sounds</label>
										<input type="checkbox" name="sound-enabled" value="1" id="prefs-sound-enabled" onclick="Spaz.UI.setSoundState(this.checked)" />
									</div>
								</div>
							</div>
										
							<div id="prefs-upgrades-fieldset" class="CollapsiblePanel">
								<h2 class="CollapsiblePanelTab" tabindex="0">Upgrades</h2>
								<div class="CollapsiblePanelContent">
									<div class="formrow">
										<label for="sound-enabled">Check on startup</label>
										<input type="checkbox" name="checkupdate-enabled" value="1" id="prefs-checkupdate-enabled" onclick="Spaz.Update.setCheckUpdateState(this.checked)" />
										<input type="button" name="user-stylesheet-button" value="Check Now &bull;" id="prefs-checkupdate-button" onclick="Spaz.Bridge.checkForUpdate()" /> <span class="restart-required">*</span>
									</div>
								</div>
							</div>

							<div id="prefs-network-fieldset" class="CollapsiblePanel">
								<h2 class="CollapsiblePanelTab" tabindex="0">Networking</h2>
								<div class="CollapsiblePanelContent">
									<div class="formrow">
										<label for="refresh-interval">Refresh interval</label>
										<input type="text" onchange="Spaz.Bridge.checkRefreshPeriod(this.value)" name="refresh-interval" id="prefs-refresh-interval" value="2" maxlength="2" size="2" /> minutes

									</div>
									<div class="formrow">
										<input type="checkbox" name="handle-http-auth" value="1"
											id="prefs-handle-http-auth"
											onclick="Spaz.Bridge.setHandleHTTPAuth(this.checked)" />
										<label for="handle-http-auth" class="checkbox">Enable HTTP auth handling</label> <!-- <span class="restart-required">*</span> -->
									</div>
								</div>
							</div>
					
							<div id="prefs-debugging-fieldset" class="CollapsiblePanel">
								<h2 class="CollapsiblePanelTab" tabindex="0">Debugging</h2>
								<div class="CollapsiblePanelContent">
									<div class="formrow">
										<label for="debugging-enabled">Enabled</label>
										<input type="checkbox" name="debugging-enabled" value="1" id="prefs-debugging-enabled" onclick="Spaz.Bridge.setDebugEnable(this.checked)" /> <span class="restart-required">*</span>
									</div>
									<div class="formrow">
										<input type="button" id="prefs-console-button" name="open-console" value="Open Firebug console &bull;" onclick="console.open()" />
										<input type="button" id="prefs-dumphtml-button" name="dump-html" value="Dump HTML &bull;" onclick="Spaz.Bridge.dumpHTML()" />
									</div>
								</div>
							</div>
					
						</div>
				
						<div class="formrow" style="text-align:right; margin-top:15px">
							<div><span class="restart-required">*</span> <span class="prefs-restart-msg">restart required</span></div>
							<input type="button" id="prefs-update-button" name="update" value="Save Preferences &bull;"
								onclick="Spaz.Data.verifyPassword()" /> 
						</div>

						</form>

					</div>
				</div>
		
			</div>
		</div>



		<!-- ENTRYFORM -->
		<form id="entryform" onSubmit="return false;">
			<textarea id="entrybox" onfocus='Spaz.UI.showEntryboxTip()' onblur='Spaz.UI.resetStatusBar(); $("body").focus(); return false;' tabindex="0"></textarea>
			<div id="entrystats"><span id="chars-left"></span> chars left</div>
			<input type="button" onclick="Spaz.UI.sendUpdate()" id="updateButton" value="Send &raquo;" tabindex="0" />
		</form>

		<!-- STATUSBAR -->
		<div id="statusbar" onmousedown="Spaz.UI.onNativeMove();">
			<!-- LOADING -->
			<span id='loading'><img src='{theme-dir}/images/loading.gif' /></span>
			<span id='statusbar-text'>Ready</span>
		</div>


		<div id="resize-sw" onmousedown="Spaz.UI.onResize()">
		</div>



		<!-- ABOUT -->
		<div id="aboutWindow" class="popupWindow" style="display:none">
			<div class="popupWindowBar"><span class="window-button" onclick="Spaz.UI.hideAbout()" title="Close">&times;</span></div>
			<a onclick="openInBrowser('http://twitter.com/spaz/')"><img src="images/spaz-icon-alpha.png" width="64" height="64" id="spazIcon" /></a>
			<h2>Spaz</h2>
			<h3>A Twitter client for the Adobe Integrated Runtime</h3>
			<p><a href="http://funkatron.com/apps/spaz/AIR/whatsnew.html" target="_blank"><span id="about-version"></span> – What's new</a></p>

			<p>Created by <a onclick="openInBrowser('http://funkatron.com')">Ed Finkler, Funkatron Productions</a></p>

			<ul>
				<li><a onclick="openInBrowser('http://twitter.com/spaz/')">Spaz on Twitter</a></li>
				<li><a onclick="openInBrowser('http://funkatron.com/spaz/')">Spaz Homepage</a></li>
				<li><a onclick="openInBrowser('http://funkatron.com/apps/spaz/AIR/LICENSE.txt')">Spaz License</a></li>
			</ul>

	
			<div id="about-thanks">Special thanks to Alexandru Chiculita and the AIR engineering team</div>


			<h3>Libraries used</h3>
			<ul>
				<li><a onclick="openInBrowser('http://www.jquery.com/');">jQuery</a></li>
				<li><a onclick="openInBrowser('http://labs.adobe.com/technologies/spry/');">Spry</a></li>
				<li><a onclick="openInBrowser('http://www.getfirebug.com/lite.html');">Firebug Lite</a></li>
				<li><a onclick="openInBrowser('http://www.webtoolkit.info/javascript-md5.html');">Webtoolkit Base64</a></li>
				<li><a onclick="openInBrowser('http://www.attacklab.net/showdown-gui.html');">Showdown</a></li>
				<li><a onclick="openInBrowser('http://code.google.com/p/as3notificationlib/')l">as3notificationlib</a></li>
			</ul>
	
		</div>

		<div id="helpWindow" class="popupWindow" style="display:none">
			<div class="popupWindowBar"><span class="window-button" onclick="Spaz.UI.hideHelp()" title="Close">&times;</span></div>
			<h2>Help</h2>

			<h3>Keyboard shortcuts</h3>
			
			<p><em>Note: Windows users should use CTRL instead of CMD</em></p>
			
			<table id="help-shortcuts" class="data">
				<tbody>
					<tr>
						<th>key</th>
						<th>command</th>
					</tr>
					<tr>
						<td class="label">CMD+B</td>
						<td class="value">Markdown: <strong>bold</strong></td>
					</tr>
					<tr>
						<td class="label">CMD+I</td>
						<td class="value">Markdown: <em>italic</em></td>
					</tr>
					<tr>
						<td class="label">CMD+U</td>
						<td class="value">Markdown: <a>link&raquo;</a></td>
					</tr>
					<tr>
						<td class="label">CMD+R</td>
						<td class="value">Markdown: <code>code</code></td>
					</tr>
					<tr>
						<td class="label">CMD+F</td>
						<td class="value"><strong>toggle</strong> between showing all tweets and only replies &amp; direct messages</td>
					</tr>
					<tr>
						<td class="label">UP or J or CMD+J</td>
						<td class="value">select next message</td>
					</tr>
					<tr>
						<td class="label">DOWN or K or CMD+K</td>
						<td class="value">select previous message</td>
					</tr>
					<tr>
						<td class="label">CMD+DOWN</td>
						<td class="value">select next dm</td>
					</tr>
					<tr>
						<td class="label">CMD+UP</td>
						<td class="value">select previous dm</td>
					</tr>
					<tr>
						<td class="label">CMD+SHIFT+DOWN</td>
						<td class="value">select next reply</td>
					</tr>
					<tr>
						<td class="label">CMD+SHIFT+UP</td>
						<td class="value">select previous reply</td>
					</tr>
					<tr>
						<td class="label">CMD+END</td>
						<td class="value">select last message</td>
					</tr>
					<tr>
						<td class="label">CMD+HOME</td>
						<td class="value">select first message</td>
					</tr>
					<tr>
						<td class="label">F5</td>
						<td class="value">reload current view</td>
					</tr>
					<tr>
						<td class="label">SHIFT+F5</td>
						<td class="value">clear and reload current view</td>
					</tr>
					<tr>
						<td class="label">CMD+SHIFT+A</td>
						<td class="value">open shorten link window</td>
					</tr>
					<tr>
						<td class="label">CMD+T</td>
						<td class="value">jump to message entry box</td>
					</tr>
					<tr>
						<td class="label">(CMD+SHIFT+2)</td>
						<td class="value">respond to sender of currently selected message</td>
					</tr>
					<tr>
						<td class="label">CMD+,</td>
						<td class="value">View Preferences</td>
					</tr>
					<tr>
						<td class="label">CMD+1-4</td>
						<td class="value">Switch to tab 1-4</td>
					</tr>

					
				</tbody>
			</table>	
		</div>

		<div id="shortLinkWindow" class="popupWindow" style="display:none">
			<div class="popupWindowBar"><span class="window-button" onclick="Spaz.UI.hideShortLink()" title="Close">&times;</span></div>
			<h2>Shorten Link</h2>
			<form id="shortenLink-form" onsubmit="Spaz.Data.shortenLink(); return false;">
				<div class="formrow">
					<label for="original-link">Link</label>
					<input type="text" name="original-link" id="shorten-original-link" value="http://" />
				</div>
				<div class="formrow">
					<label for="short-link">Short</label>
					<input type="text" name="short-link" id="shorten-short-link" value="" />
				</div>
				<div class="formrow" style="text-align:right; margin-top:15px">
					<span id="verification-result">&nbsp;</span>
					<input type="button" id="prefs-update-button" name="update" value="Shorten &bull;"
						onclick="Spaz.Data.shortenLink()" /> 
				</div>
			</form>
		</div>


		<div id="updateCheckWindow" class="popupWindow" style="display:none;"> 
			Checking for updates...
		</div>



		<div id="linkContextMenu" class="context-menu">
			<ul>
				<li id="menu-copyLink">Copy Link Address</li>
			</ul>
		</div>


		<div id="tooltip" class="context-menu">
	
		</div>


	</div> <!-- End #container -->










	<script type="text/javascript">

		// because MooTools is a prick, we change the standard
		// jQuery shortcut to $j
		// var $j = jQuery.noConflict();


		/**
		 * Default prefs vars
		 */
		var reloadID; // identifier for the auto-reloader
		// var memoryRefreshID; // identifier for the memory reporter

		var entryBoxHint = "What are you doing?";

		var toolTipPrefs = {
			track: false, 
			delay: 0, 
			showURL: false, 
			showBody: false,
			extraClass: "tab-tooltip",
			opacity: 0.8,
			top:15,
			left:8
		};

		/**
		Keyboard shortcut definitions
		**/
		document.onkeydown = Spaz.UI.keyboardHandler
			
		// document.onclick   = function(ev) {
		// 	alert(event.target.id + ':' + event.target.tagName);
		// };
		// document.onmouseover = Spaz.UI.focusHandler
		// document.onmouseout  = Spaz.UI.blurHandler
		// window.onfocus = Spaz.UI.focusHandler;

		/* This is stuff we do right after the document is ready */
		// $(document).ready( function() {
		// 	
		// });



		window.onload = function(){
						
			Spaz.Bridge.$init(Spaz.childFrameInit);
		
		}
		
		


		/**
		 * Window manip funcs
		 */
		Spaz.UI.onNativeMove = function(){
			Spaz.Bridge.startMove();
		}
		Spaz.UI.onResize = function(){
			Spaz.Bridge.startResize();
		}
	
		
		// stuff to load when this doc loads
		$(document).ready( function() {
			
			
			// ***************************************************************
			// Event delegation handling
			// ***************************************************************
			$('body').intercept('mouseover', {
					'.user-screen-name[title]':function() {
						Spaz.UI.showUserTooltip(this, $(this).attr('title'));
					},
					'.user-image[title]':function() {
						Spaz.UI.showUserTooltip(this, $(this).attr('title'));
					},
					'a[title]':function() {
						Spaz.UI.showTooltip(this, $(this).attr('title'), $(this).attr('href'));
						// air.trace(this.outerHTML);
					},

				})
				.intercept('mouseout', {
					'[title]':function() {
						Spaz.UI.hideTooltips();
					}
				})
				.intercept('click', {
					'a[href]':function() {
						var url = $(this).attr('href');
						openInBrowser(url);
						return false;
					},
					'.user-screen-name':function() {
						var url = 'http://twitter.com/'+$(this).attr('user-screen_name');
						openInBrowser(url);
					},
					'.user-image':function() {
						var url = 'http://twitter.com/'+$(this).attr('user-screen_name');
						openInBrowser(url);
					},
					'.status-action-fav':function() {
						Spaz.Data.makeFavorite($(this).attr('entry-id'))
					},
					'.status-action-dm':function() {
						Spaz.UI.prepDirectMessage($(this).attr('user-screen_name'));
					},
					'.status-action-reply':function() {
						Spaz.UI.prepReply($(this).attr('user-screen_name'));
					},
					'.status-action-del':function() {
						Spaz.Data.destroyStatus($(this).attr('entry-id'))
					},
					'.timeline-entry':function() {
						$('div.timeline-entry').removeClass('ui-selected');
						$(this).addClass('ui-selected');
					},
					'.timeline-entry *':function() { // this one needs to be last so the more specific ones above take precedence
						$('div.timeline-entry').removeClass('ui-selected');
						var entry = $(this).parents('.timeline-entry');
						entry.addClass('ui-selected');
					},
				})
			 // end intercept
		

		
		
		}) // end $(document).ready function
		

	</script>

</body>
</html>
